<template>
  <div class="my-wrap">
    <div v-html="text"></div>
    <el-input type="textarea" rows="5" v-model="text"></el-input>
    <el-button type="primary" @click.stop="format">
      格式化
    </el-button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      text: "11"
    };
  },
  watch: {
    text(newV, oldV) {
      console.log(newV);
    }
  },
  methods: {
    format() {
      let text = this.text;

      text = text
        .replace(/\n/g, "-----paragraph----")
        .replace(/-----paragraph----\s+/g, "")
        .replace(/(-----paragraph----)+/g, "\n\n");

      this.text = text;
    }
  }
};
</script>

<style>
.my-wrap {
  width: 1200px;
  height: 640px;
  margin: 0 auto;
  margin-top: 100px;
  color: #333;
}
</style>
